import Vue from 'vue';
import App from './App.vue';
import router from './router';
import Vant from 'vant';
import axios from 'axios';

import { Toast } from 'vant';

import 'vant/lib/index.css';

Vue.use(Vant);

// 绑定到原型
Vue.prototype.$axios = axios;
// 添加基准路径
axios.defaults.baseURL = "http://localhost:3000";

// 设置请求拦截器
axios.interceptors.request.use(config=>{
  // 判断是否有token值或请求配置没有，就加上
  if(localStorage.getItem('userToken') && !config.headers.Authorization){
    config.headers.Authorization = "Bearer " + localStorage.getItem('userToken')
  }

  // 跟响应拦截器一样，拦截后需要return 才能放行
  return config
})

// 添加路由守卫
router.beforeEach((to, from, next) => {
  // to :指目标路由
  // from：来源路由
  // next:放行函数
  // 使用路由守卫，每当跳转到个人中心时候，先校验token,如果没有，就重定向登录页

  // 是否有token
  const hsaUserToken = localStorage.getItem("userToken")

  // console.log('to',to);
  if (to.meta.auth) {
    if (hsaUserToken) {
      return next();
    } else {
      // 没有token则跳转到登录页
      return router.push('/login')
    }
  }

  next();
})

// 添加全局拦截器
axios.interceptors.response.use(res => {
  const {
    statusCode,
    message
  } = res.data;

  if (statusCode && message === "用户信息验证失败") {
    Toast.fail('用户信息校验失败，重新登录');
    localStorage.removeItem('userToken');
    localStorage.removeItem('userId');
    router.replace('/login')
  }

  return res;
})

// 全局过滤器(修复图片地址不完整的情况)
Vue.filter('fixImgUrl',function(url){
  const regExp = /^http/

  if(regExp.test(url)){
    return url;
  }else{
    return axios.defaults.baseURL + url; 
  }
})

Vue.config.productionTip = false;

new Vue({
  router,
  render: function (h) {
    return h(App)
  }
}).$mount('#app')